﻿@using HelloMinasan.Framework.Web.WebHelpers
@using HelloMinasan.Framework.Helpers

@model HelloMinasan.Web.Song.ViewModels.HomeModels
@{
    ViewBag.Title = "Home Page";
}

<div class="contentSection">
    <table width="100%">
        <tr>
            <td valign="top" style="width:400px;">
                <div class="titleSectionTheme2">
                    <img src="@Url.Content("~/Content/Images/starYellow.png")" width="32" height="32" />
                    Top Highest Score Songs
                </div>
                <div class="contentSectionInside" style="margin-bottom: 10px;">
                    @foreach (var item in Model.TopHighestScoreSongs)
                    {
                        <a href="@Url.Content("~/Song/Songs/" + @item.Id)">
                            <div class="relativeSongDivContainer">
                                <div class="imageLeftRelativeSongs">
                                    <img src="@Url.Content("~/Content/Images/song.png")" width="30" height="30"/>
                                </div>
                                <div class="starScore">@item.LikeTime</div>
                                <div class="titleSongName">
                                    @item.SongName
                                </div>
                                <div>
                                    Posted date: @item.PostedDate.ToShortDateString()
                                    <br />
                                   Posted by: <a class="titleNewFont" href="/Account/UserInformation/@item.User.Username"><b> @item.User.Username</b></a>
                                </div>
                            </div>
                        </a>
                    }
                </div>

                <div class="titleSectionTheme2">
                    <img src="@Url.Content("~/Content/Images/starYellow.png")" width="32" height="32" />
                    Top Highest Score Users
                </div>
                <div class="contentSectionInside" style="margin-bottom: 10px;">
                    @foreach (var item in Model.TopHighestScoreUsers)
                    {
                        <a href="@Url.Content("~/Account/UserInformation/")@item.Username">
                            <div class="relativeSongDivContainer">
                                <div class="imageLeftRelativeSongs">
                                    @*<img src="" width="45" height="60"/>*@
                                    @Html.Avatar(item.Id, item.HasAvatar, HelloMinasan.Cdn.AvatarSize.SmallSearch, new { alt = item.DisplayName })
                                </div>
                                <div class="starScore">@item.Point</div>
                                <div class="titleSongName">
                                    @item.Username
                                </div>
                                <div>
                                    Date of birth: @item.DOB
                                    <br />
                                    Status : to be implemented
                                </div>
                            </div>
                        </a>
                    }
                </div>
            </td>
            <td valign="top" colspan="2" rowspan="2" style="padding-left:5px;">
                <div class="titleSectionTheme2">
                    <img src="@Url.Content("~/Content/Images/community.png")" width="32" height="32" />
                    Community
                </div>
                <div class="contentSectionInside" style="margin-bottom: 10px;">
                    @foreach (var item in Model.TopNewestQAs)
                    {
                        <a href="@Url.Content("~/QA/Details/" + @item.Id)">
                            <div class="relativeSongDivContainer">
                                <div class="imageLeftRelativeSongs">
                                    <img src="@Url.Content("~/Content/Images/question.png")" width="30" height="30"/>
                                </div>
                                <div class="titleSongName">
                                    @item.QuestionTitle
                                </div>
                                <div>
                                    Posted date: @item.PostedDate.ToShortDateString()
                                    <br />
                                    Owner : <strong class="titleNewFont">@item.User.Username</strong>
                                </div>
                            </div>
                        </a>
                    }
                </div>
            </td>
            @*<td style="width:150px;" valign="top">
                <div class="titleSectionTheme2">
                    <img src="@Url.Content("~/Content/Images/lyric.png")" width="32" height="32" />
                    Resource
                </div>
                <div class="contentSectionInside" align="center" style="margin-bottom: 10px; padding:10px;">
                    <div style="width:70px; margin:10px; display:inline-block; border:1px solid #ccc; background-color:white; padding:10px;" align="center">
                        <img src="~/Content/Images/song.png" />
                        <br /><br /> @Model.TotalSong song(s)
                    </div>
                    <div style="width:70px; margin:10px; display:inline-block; border:1px solid #ccc; background-color:white; padding:10px;" align="center">
                        <img src="~/Content/Images/userItem.png" />
                        <br /><br /> @Model.TotalUser user(s)
                    </div>
                    <div style="width:70px; margin:10px; display:inline-block; border:1px solid #ccc; background-color:white; padding:10px;" align="center">
                        <img src="~/Content/Images/articles-y.png" />
                        <br /><br /> @Model.TotalThread thread(s)
                    </div>
                </div>



                <div class="titleSectionTheme2">
                    <img src="@Url.Content("~/Content/Images/statisticIcon.png")" width="32" height="32" />
                    Statistic
                </div>
                <div class="contentSectionInside" align="left" style="margin-bottom: 10px; padding:10px;">
                    Accessing Count: 
                    <br />
                    Online:
                </div>
            </td>*@
        </tr>
    </table>
</div>
